<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<ul>
    <li></li>
    <li></li>
    <li></li>
</ul>
<script>
    /*
    *
    * forEach方法的 重要程度：
    *   遍历数组 -> 对数组里面的每一项进行操作（自己定义的操作）

    let arr = ["银时","阿飞","万章"]
    let name = "银时"
    function log(name){
        console.log(`${name}帅`)
    }
    arr.forEach(log)

     */

    /*
    * 给每个li添加一段文字“你好”，设置文字颜色为红色
    *
    * 1.遍历
    * 2.设置 只需要获取单个元素
    *
    function setStyle(li){
        li.innerHTML = "你好"
        li.style.color = "red"
    }

    let liList = document.querySelectorAll("ul li")

    liList.forEach(setStyle) //对liList进行遍历 拿到每一个li 进行函数操作
    */
    //用箭头函数设置
    let liList = document.querySelectorAll("ul li")

    liList.forEach((li) => {
        li.innerHTML = "你好"
        li.style.color = "red"
    })

    /*
    * forEach标准写法：
    *   数组.forEach(需要执行的函数)
    *   //数组里面的每一项都交给执行函数处理
    *
    *   其中执行函数，叫做回调函数 -> 回头调用 一开始不执行 当数组里面找到每一项并将每一项传入的时候 再去执行函数
    *
    *   回调函数的第一个参数是：数组里面的每一项
    *
    * */

    let arr = [1,3,5,-4,4,-6,0,56,7,-9]

    //将数组里面的所有正数打印出来

    arr.forEach(function (num){ //num的来源就是数组中遍历的每一项
        if(num > 0){
            console.log(num)
        }
    })

    //用箭头函数 () => {}
    arr.forEach((n) => {
        if(n > 0){
            console.log(n)
        }
        //console.log(this)
    })

    /*
    * 语法知识：
    *   forEach 接收几个参数？接收一个参数（回调函数）
    *
    *   回调函数接收三个参数（接收的三个形式参数全是 forEach执行的时候传入的实参）：用来描述当前遍历的元素的特点的
    *       第一个参数 item 表示forEach遍历的每个元素
    *       第二个参数 index 表示forEach遍历的每个元素的下标
    *       第三个参数 arr 就是数组本身
    *
    *   如：
    *   arr.forEach(function(item,index,arr){
    *       console.log(item,index,arr)
    *   })
    *
    *
    * */
    let shu = ["你","好","吗"]
    //将下标为偶数项打印出来
    /*shu.forEach(function (item,index){
        if(index % 2 === 0){
            console.log(item)
        }
    })*/
    //shu.forEach((...arg) => {console.log(...arg)})
    //因为上面写法太难看，所以转化成下面的写法，其中参数就是这样接收的arguments
    //shu.forEach(console.log) //怎么接收的参数看上面

    let log = console.log.bind(console) //绑定了console的方法
    shu.forEach(log)

</script>
</body>
</html>